<link href="https://cdn.bootcdn.net/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.css" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.js"></script>
<script src="https://res.dcdev.net/dcdev/v1.0.6/assets/js/render_somthing.js"></script>
<script class="_dcdev_preset_" src="https://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<style type="text/css">
	.baguetteBoxOne a{
		width: 100%;
		height: 200px;
		margin-bottom: 10px;
	}
	.baguetteBoxOne img{
		width: 100%;
		height: 100%;
	}
</style>
<div id="pic_list"></div>
<script>
    var pic_list;
    pic_list = new render_somthing();
    pic_list.init({
        // div的id
        id: "#pic_list",
        // x/y/flow   分别为x向滚动、y向滚动、瀑布流
        method: "y",
        // 容器是指即将渲染内容的外围容器，可以为div/table/ul ...
        container: {
            html: `
<div  class="baguetteBoxOne" style="display: flex;flex-wrap: wrap;justify-content: space-around;margin-bottom:8px;" ></div>
`
        },
        // 渲染内容的配置
        content: {
            default: `
            <a href="#{href}"><img src="#{src}"></a>
`,
        },
        // 条件渲染内容
                /*
                    ^{ROW_INDEX} - 常量，表示数据数组的下标
                    #{title}     - 变量，表示数据数组中对象的key
                */
                condition: [{
                        expression: "",
                        html: `
                        `}],
        callback: {
            click: function (res) {

            }
        },
    });
    pic_list.render([
        {href:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/thumbs/1-1.jpg",src:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/thumbs/1-1.jpg"},
        {href:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-2.jpg",src:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-2.jpg"},
        {href:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-4.jpg",src:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-4.jpg"},
        {href:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-8.jpg",src:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-8.jpg"},
        {href:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-6.jpg",src:"http://www.bitauto.com/zhuanti/region/js2015/demo/018/baguetteBox/img/1-6.jpg"}
    ]);
    //执行功能
    baguetteBox.run('.baguetteBoxOne',{
		animation: 'fadeIn',
	});
</script>